﻿@using SmartStore.Core.Domain.Catalog;
@using Telerik.Web.Mvc.UI;
@model ProductAttributeOptionModel

@Html.ValidationSummary(false)
@Html.HiddenFor(model => model.Id)
@Html.HiddenFor(model => model.ProductVariantAttributeId)
@Html.HiddenFor(model => model.ProductAttributeOptionsSetId)
@Html.HiddenFor(model => model.IsListTypeAttribute)

<table class="adminContent">
	<tr>
		<td class="adminTitle">
			@Html.SmartLabelFor(model => model.ValueTypeId)
		</td>
		<td class="adminData">
			@Html.DropDownListFor(model => model.ValueTypeId, ((ProductVariantAttributeValueType)Model.ValueTypeId).ToSelectList())
			@Html.ValidationMessageFor(model => model.ValueTypeId)
		</td>
	</tr>
	<tr id="group-linked-product">
		<td class="adminTitle">
			@Html.SmartLabelFor(model => model.LinkedProductId)
		</td>
		<td class="adminData">
			@Html.HiddenFor(model => model.LinkedProductId)
			<div class="input-group">
				<input type="text" class="form-control" id="linked-product-name" placeholder="@T("Common.Unspecified")" value="@Model.LinkedProductName" readonly>
				<div class="input-group-append">
					<button type="button" id="RemoveProductLinkageButton" class="btn btn-outline-secondary">
						<i class="fa fa-times"></i>
						<span>@T("Admin.Catalog.Products.ProductVariantAttributes.Attributes.Values.UnlinkProduct")</span>
					</button>
					@(Html.SmartStore().EntityPicker()
						.For(x => x.LinkedProductId)
						.IconCssClass("fa fa-link")
						.HtmlAttribute("class", "btn btn-secondary")
						.HtmlAttribute("id", "AddProductLinkageButton")
						.MaxItems(1)
						.AppendMode(false)
						.DisabledEntityIds(Model.ProductId)
						.DialogTitle(T("Admin.Catalog.Products.ProductVariantAttributes.Attributes.Values.Fields.LinkedProduct.AddNew").Text.EncodeJsString('\'', false))
						.Caption(T("Admin.Catalog.Products.ProductVariantAttributes.Attributes.Values.LinkProduct").Text.EncodeJsString('\'', false))
						.OnSelectionCompleted("PickLinkedProduct_Completed"))
				</div>
			</div>

			@Html.ValidationMessageFor(model => model.LinkedProductId)
		</td>
	</tr>
	<tr id="group-quantity">
		<td class="adminTitle">
			@Html.SmartLabelFor(model => model.Quantity)
		</td>
		<td class="adminData">
			@Html.EditorFor(model => model.Quantity)
			@Html.ValidationMessageFor(model => model.Quantity)
		</td>
	</tr>
</table>

<p></p>

@(Html.LocalizedEditor<ProductAttributeOptionModel, ProductAttributeOptionLocalizedModel>("productattribute-localized",
@<table class="adminContent">
    <tr>
        <td class="adminTitle">
            @Html.SmartLabelFor(model => model.Locales[item].Name)
        </td>
        <td class="adminData">
			@*IMPORTANT: Do not delete, this hidden element contains the id to assign localized values to the corresponding language *@
			@Html.HiddenFor(model => model.Locales[item].LanguageId)

            @Html.EditorFor(model => Model.Locales[item].Name)
            @Html.ValidationMessageFor(model => model.Locales[item].Name)
        </td>
    </tr>
    <tr>
        <td class="adminTitle">
            @Html.SmartLabelFor(model => model.Locales[item].Alias)
        </td>
        <td class="adminData">
            @Html.EditorFor(model => Model.Locales[item].Alias)
            @Html.ValidationMessageFor(model => model.Locales[item].Alias)
        </td>
    </tr>
</table>
,
@<table class="adminContent">
    <tr>
        <td class="adminTitle">
            @Html.SmartLabelFor(model => model.Name)
        </td>
        <td class="adminData">
            @Html.EditorFor(model => model.Name)
            @Html.ValidationMessageFor(model => model.Name)
        </td>
    </tr>
	    <tr>
        <td class="adminTitle">
            @Html.SmartLabelFor(model => model.Alias)
        </td>
        <td class="adminData">
            @Html.EditorFor(model => model.Alias)
            @Html.ValidationMessageFor(model => model.Alias)
        </td>
    </tr>
</table>
))
<table class="adminContent">
	@if (Model.IsListTypeAttribute)
	{
		<tr>
			<td class="adminTitle">
				@Html.SmartLabelFor(model => model.PictureId)
			</td>
			<td class="adminData">
				@Html.EditorFor(model => model.PictureId, new { transientUpload = true })
				@Html.ValidationMessageFor(model => model.PictureId)
			</td>
		</tr>
		<tr>
			<td class="adminTitle">
				@Html.SmartLabelFor(model => model.Color)
			</td>
			<td class="adminData">
				@Html.EditorFor(model => model.Color)
				@Html.ValidationMessageFor(model => model.Color)
			</td>
		</tr>
	}
	<tr id="group-price-adjustment">
		<td class="adminTitle">
			@Html.SmartLabelFor(model => model.PriceAdjustment)
		</td>
		<td class="adminData">
			@Html.EditorFor(model => model.PriceAdjustment)
			@Html.ValidationMessageFor(model => model.PriceAdjustment)
		</td>
	</tr>
	<tr id="group-weight-adjustment">
		<td class="adminTitle">
			@Html.SmartLabelFor(model => model.WeightAdjustment)
		</td>
		<td class="adminData">
			@Html.EditorFor(model => model.WeightAdjustment)
			@Html.ValidationMessageFor(model => model.WeightAdjustment)
		</td>
	</tr>
	<tr>
		<td class="adminTitle">
			@Html.SmartLabelFor(model => model.IsPreSelected)
		</td>
		<td class="adminData">
			@Html.EditorFor(model => model.IsPreSelected)
			@Html.ValidationMessageFor(model => model.IsPreSelected)
		</td>
	</tr>
    <tr>
        <td class="adminTitle">
            @Html.SmartLabelFor(model => model.DisplayOrder)
        </td>
        <td class="adminData">
            @Html.EditorFor(model => model.DisplayOrder)
            @Html.ValidationMessageFor(model => model.DisplayOrder)
        </td>
    </tr>
</table>

<script>
	$(function () {
		$('#@Html.FieldIdFor(model => model.ValueTypeId)').change(function () {
			var selectedValueTypeId = $('#@Html.FieldIdFor(model => model.ValueTypeId)').val();

			if (selectedValueTypeId == '@((int)ProductVariantAttributeValueType.Simple)') {
				$('#group-linked-product').hide();
				$('#group-quantity').hide();
				$('#group-price-adjustment').show();
				$('#group-weight-adjustment').show();
			}
			else if (selectedValueTypeId == '@((int)ProductVariantAttributeValueType.ProductLinkage)') {
				$('#group-linked-product').show();
				$('#group-quantity').show();
				$('#group-price-adjustment').hide();
				$('#group-weight-adjustment').hide();
			}
		}).trigger('change');

		$('#RemoveProductLinkageButton').on('click', function () {
			$('#linked-product-name').val('');
			$('#@Html.FieldIdFor(model => model.LinkedProductId)').val('0');
			toggleLinkageButtons();
		});

		toggleLinkageButtons();
	});

	function PickLinkedProduct_Completed(ids, selectedItems, dialog) {
		$('#linked-product-name').val(selectedItems[0].name);
		return true;
	}

	function toggleLinkageButtons() {
		var unlinked = ($('#@Html.FieldIdFor(model => model.LinkedProductId)').val() === '0');
		$('#AddProductLinkageButton').toggle(unlinked);
		$('#RemoveProductLinkageButton').toggle(!unlinked);
	}
</script>